Plex.Lib.JS.load('UI.Button.Core');
Plex.Lib.CSS.load('UI.Button.Hover');

Plex.UI.Button.Hover = function()
{
	Plex.S$.extend(this,Plex.UI.Button.Core)

	//Callback
	var self = this;
	
	//Predefine Additionall Handlers
	this.onmouseover=function(){};
	this.onmouseout=function(){};

	//Create
	this.el = {}
	this.el.mainDiv=new Element('div',{'class':'Hover','styles':{'z-Index':1}});
	this.el.mainTbl=new Element('table',{'cellspacing':0,'cellpadding':0}).injectInside(this.el.mainDiv);
	
	this.el.topRow=new Element('tr').injectInside(this.el.mainTbl);
	this.el.middleRow=new Element('tr').injectInside(this.el.mainTbl);
	this.el.bottomRow=new Element('tr').injectInside(this.el.mainTbl);
	
	this.el.topLeftCol=new Element('td',{'class':'TopLeft'}).injectInside(this.el.topRow);
	this.el.topCenterCol=new Element('td',{'class':'TopCenter'}).injectInside(this.el.topRow);
	this.el.topRightCol=new Element('td',{'class':'TopRight'}).injectInside(this.el.topRow);
	
	this.el.middleLeftCol=new Element('td',{'class':'MiddleLeft'}).injectInside(this.el.middleRow);
	this.el.body=new Element('td',{'class':'Body'}).injectInside(this.el.middleRow);
	this.el.middleRightCol=new Element('td',{'class':'MiddleRight'}).injectInside(this.el.middleRow);
	
	this.el.bottomLeftCol=new Element('td',{'class':'BottomLeft'}).injectInside(this.el.bottomRow);
	this.el.bottomCenterCol=new Element('td',{'class':'BottomCenter'}).injectInside(this.el.bottomRow);
	this.el.bottomRightCol=new Element('td',{'class':'BottomRight'}).injectInside(this.el.bottomRow);


	//Declare Mover Over Handler
	this.el.mainDiv.onmouseover=function(event)
	{
		if(event)
		event.stopPropagation();
				
		self.object.className='Hover_On';
		self.object.style.zIndex=2;
//		Self.onmouseover(Self.obj);
	} 

	//Declare Mover Off Handler
	this.el.mainDiv.onmouseout=function(event)
	{
		if(event)
		event.stopPropagation();
		
		self.object.className='Hover';
		self.object.style.zIndex=1;
//		Self.onmouseout(Self.obj);
	}
	
	this.setTitle = function(newTitle)
	{
//		this.title = newTitle;
//		this.el.middleCol.setText(newTitle);
	}
	
	this.moveTo = function(parent)
	{
		this.el.mainDiv.injectInside(parent);
	}
	
	this.object = this.el.mainDiv;
}